import { useHistory } from 'react-router-dom'
import qs from 'qs'
export default function A3() {
    let history = useHistory();
    return <div>
        A3
        <button onClick={() => {
            /**
             * 传参方案一：问号传参
             *  + 传递的信息出现在URL地址上：丑、不安全、长度限制
             *  + 信息是显式的，即便在目标路由内刷新，传递的信息也在
             */
            // history.push('/c?id=100&name=zhufeng');
           /*  history.push({
                pathname:'/c',
                search: qs.stringify({
                    id:100,
                    name:'zhufeng'
                })
            }) */
            /**
             * 方案三：隐式传参
             *  + 传递的信息不会出现在URL地址中：安全、美观，也没有限制
             *  + 在目标组件内刷新，传递的信息就丢失了
             */
            history.push({
                pathname:'/c',
                state:{
                    id:100,
                    name:'zhufeng'
                }
            })
        }}>点我跳转到C</button>
    </div>
}
